doctype html
html.app(lang='en')
  head
    meta(charset='utf-8')
    title Musik
    include ../common/head
  body
    section.vbox
      header.bg-white-only.header.header-md.navbar.navbar-fixed-top-xs
        .navbar-header.aside.bg-info.dk
          include ../common/navbar-header
        include ../common/navbar-ul
        include ../common/navbar-form
        include ../common/navbar-right
      section
        section.hbox.stretch
          // .aside
          aside#nav.bg-black.dk.aside.hidden-print
            section.vbox
              section.w-f-md.scrollable
                .slim-scroll(data-height='auto', data-disable-fade-out='true', data-distance='0', data-size='10px', data-railopacity='0.2')
                  include ../common/sidebar
              include ../common/sidebarfooter
          section#content
            section.hbox.stretch
              // .aside
              aside
                section.vbox
                  section.scrollable.wrapper
                    .timeline
                      article.timeline-item.active
                        .timeline-caption
                          .panel.bg-primary.lt.no-borders
                            .panel-body
                              span.timeline-icon
                                i.fa.fa-bell-o.time-icon.bg-primary
                              span.timeline-date 7:30 am
                              .text-sm Wake up
                              h5 Me
                              .m-t-sm.timeline-action
                                span.h3.pull-left.m-r-sm 4:51
                                button.btn.btn-sm.btn-default.btn-bg
                                  i.fa.fa-pause
                                  |  Pause
                                button.btn.btn-sm.btn-default.btn-bg
                                  i.fa.fa-check
                                  |  Confirm
                      article.timeline-item
                        .timeline-caption
                          .panel.panel-default
                            .panel-body
                              span.arrow.left
                              span.timeline-icon
                                i.fa.fa-phone.time-icon.bg-primary
                              span.timeline-date 12:25 am
                              .text-sm Call to
                              h5
                                | Jason Cokde (021-254-3523)
                      article.timeline-item.alt
                        .timeline-caption
                          .panel.panel-default
                            .panel-body
                              span.arrow.right
                              span.timeline-icon
                                i.fa.fa-male.time-icon.bg-success
                              span.timeline-date 10:00 am
                              .text-sm Appointment
                              h5
                                | Carmark Sook (.inc company)
                              p Morbi nec nunc condimentum, egestas dui nec,
                      article.timeline-item
                        .timeline-caption
                          .panel.panel-default
                            .panel-body
                              span.arrow.left
                              span.timeline-icon
                                i.fa.fa-plane.time-icon.bg-dark
                              span.timeline-date 8:00 am
                              .text-sm Fly to
                              h5
                                | Newyork City
                              p 82&deg;, Very hot with some sun
                      article.timeline-item.alt
                        .timeline-caption
                          .panel.panel-default
                            .panel-body
                              span.arrow.right
                              span.timeline-icon
                                i.fa.fa-file-text.time-icon.bg-info
                              span.timeline-date 9:30 am
                              .text-sm Meeting
                              h5
                                | Office A - 2 floor
                              p
                                | Iaculis lorem justo porttitor orci. Vivamus vestibulum tortor augue. Donec elementum mollis velit.
                      article.timeline-item
                        .timeline-caption
                          .panel.panel-default
                            .panel-body
                              span.arrow.left
                              span.timeline-icon
                                i.fa.fa-code.time-icon.bg-dark
                              span.timeline-date 9:00 am
                              .text-sm Work on
                              h5
                                | Web application project
                              p Iaculis lorem justo porttitor orci. Donec elementum mollis velit.
                      .timeline-footer
                        a(href='#')
                          i.fa.fa-plus.time-icon.inline-block.bg-dark
              // /.aside
            a.hide.nav-off-screen-block(href='#', data-toggle='class:nav-off-screen,open', data-target='#nav,html')
    include ../common/footer
